import { Link } from 'react-scroll';

import { Sup } from './Sup';
import cs from './Sup.module.scss';

export const ScrollSup = ({ number }: { number: number }) => (
  <Link
    className={cs.link}
    data-testid={`scroll-sup-${number}`}
    duration={400}
    href={`#${number}`}
    offset={-126}
    smooth
    spy
    to={number.toString()}
  >
    <Sup>({number})</Sup>
  </Link>
);
